<template>
    <div>
        <div class="content">
            <div class="left">
                <div class="people">
                    <div class="people-title">人员选择</div>
                    <div class="border_people">
                        <el-row v-for="(item, index) in data.people" :key="index" class="info_row">
                            <el-col :span="5" style="margin-top: 5px;">
                                姓名：{{ item.nickname }}
                            </el-col>
                            <el-col :span="7" style="margin-top: 5px;">
                                手机号：{{ item.phone ? item.phone.replace(/^(.{3})(?:\w+)(.{4})$/,"\$1 **** \$2") : "" }}
                            </el-col>
                            <el-col :span="9" style="margin-top: 5px;">
                                身份证号码：{{ item.cardId ? item.cardId.replace(/^(.{4})(?:\w+)(.{3})$/, "\$1***********\$2")
                                : "" }}
                            </el-col>
                            <el-col :span="3">
                                <el-button type="primary" size="default" @click="te(item, index)" class="bu"
                                    style="margin-left: 48px;">
                                    添加 +</el-button>
                            </el-col>
                        </el-row>
                    </div>
                </div>
                <div class="userCard">
                    <div class="title">乘机人</div>
                    <div v-if="data.human != ''">
                        <div class="o-card " v-for="(item, index) in data.human" :key="index">
                            <div class="card-left">
                                <div class="span">{{ index + 1 }}</div>
                            </div>
                            <div class="card-right">
                                <el-button class="del" @click="re(item, index)">
                                    <close theme="outline" size="30" fill="#333" />
                                </el-button>
                                <div class="info">
                                    <el-row>
                                        <el-col :span="3">
                                            <div class="label">姓名:</div>
                                        </el-col>
                                        <el-col :span="18" class="col_info">
                                            <div class="col_info_div">{{ item.nickname }}</div>
                                        </el-col>
                                    </el-row>
                                </div>
                                <div class="info">
                                    <el-row>
                                        <el-col :span="3">
                                            <div class="label">身份证:</div>
                                        </el-col>
                                        <el-col :span="18" class="col_info">
                                            <div class="col_info_div">{{ item.cardId ?
                                                item.cardId.replace(/^(.{4})(?:\w+)(.{3})$/,
                                                "\$1***********\$2") : ""
                                                }}</div>
                                        </el-col>
                                    </el-row>
                                </div>
                                <div class="info">
                                    <el-row>
                                        <el-col :span="3">
                                            <div class="label">手机号:</div>
                                        </el-col>
                                        <el-col :span="18" class="col_info">
                                            <div class="col_info_div">{{ item.phone ?
                                                item.phone.replace(/^(.{3})(?:\w+)(.{4})$/,
                                                "\$1 **** \$2") : ""
                                                }}</div>
                                        </el-col>
                                    </el-row>
                                </div>

                            </div>
                        </div>
                    </div>


                    <div class="button">
                        <el-button type="primary" size="default" @click="showAddPeople" class="bu">+ 新增常用乘机人</el-button>
                    </div>
                </div>
            </div>
            <div class="right_div">
                <div class="pgup" @click="pgup">
                    返回上一页
                </div>

                <!-- 中转 -->
                <div class="right" v-if="istransfer =='tickets'">
                    <div class="ticket">
                        <div style="padding-top: 5px;margin-left: 445px; font-size: 20px;">
                            <close theme="outline" size="20" fill="#333" />
                            {{data.human.length}}
                        </div>
                        <div class="row">
                            <el-row>
                                <el-col :span="24">
                                    <div class="text">{{ dataTicket.tickets[0].startDate }}&nbsp;
                                        {{dataTicket.tickets[0].upCity }}
                                        <arrow-right theme="outline" size="22" fill="#000000" />
                                        {{dataTicket.tickets[1].downCity}}
                                    </div>
                                    <div class="plane"><img :src="dataTicket.tickets[0].companyLogos" alt="" srcset="">
                                        {{ dataTicket.tickets[0].company }}
                                        {{ dataTicket.tickets[0].fname }}&nbsp;
                                        {{ dataTicket.tickets[0].pname }}&nbsp;
                                        {{ dataTickets.ticketTypeName }}</div>
                                </el-col>
                                <el-col :span="24">
                                    <div class="time">
                                        {{ dataTicket.tickets[0].startTime.slice(0, 5) }} <span class=" time-dt">---
                                            <Time theme="outline" size="15" fill="#6b778c" />{{
                                            dataTicket.tickets[0].sailingTime.slice(0, 5) }}
                                            ---</span> {{ dataTicket.tickets[0].endTime.slice(0, 5) }}
                                    </div>
                                </el-col>
                                <el-col :span="12">
                                    <span style="font-size: 14px; margin-left: 28px;">{{
                                        dataTicket.tickets[0].upAirportName }}</span>
                                </el-col>
                                <el-col :span="12">
                                    <span style="font-size: 14px; margin-left: -27px;">{{
                                        dataTicket.tickets[0].downAirportName}}</span>
                                </el-col>
                                <div style="margin-left: 48px; margin-top: 15px;"
                                    v-if="dataTickets.ticketTypeName == '经济舱'">成人票 <span
                                        class=" price">---------------------------------------
                                        ￥{{ dataTicket.tickets[0].discountPrice }}元</span></div>
                                <div style="margin-left: 48px; margin-top: 15px;" v-else>
                                    成人票 <span class=" price">---------------------------------------
                                        ￥{{ dataTickets.ticketPrice }}元</span>
                                </div>
                            </el-row>
                        </div>
                        <el-row class="transit_row">
                            <el-col :span="24">
                                <span class="transit_shipment">中转{{ dataTicket.tickets[1].upCity }}</span>
                                <div style="padding: 8px;"></div>
                                <div class="plane"><img :src="dataTicket.tickets[1].companyLogos" alt="" srcset="">
                                    {{ dataTicket.tickets[1].company }}
                                    {{ dataTicket.tickets[1].fname }}&nbsp;
                                    {{ dataTicket.tickets[1].pname }}&nbsp;
                                    {{ dataTickets.ticketTypeName }}</div>
                            </el-col>
                            <el-col :span="24">
                                <div class="time">
                                    {{ dataTicket.tickets[1].startTime.slice(0, 5) }} <span class=" time-dt">---
                                        <Time theme="outline" size="15" fill="#6b778c" />{{
                                        dataTicket.tickets[1].sailingTime.slice(0, 5)
                                        }}
                                        ---</span> {{ dataTicket.tickets[1].endTime.slice(0, 5) }}
                                </div>
                            </el-col>
                            <el-col :span="12">
                                <span style="font-size: 14px; margin-left: 28px;">{{
                                    dataTicket.tickets[1].upAirportName }}</span>
                            </el-col>
                            <el-col :span="12">
                                <span style="font-size: 14px; margin-left: -27px;">{{
                                    dataTicket.tickets[1].downAirportName}}</span>
                            </el-col>
                            <div style="margin-left: 48px; margin-top: 15px;"
                                v-if="dataTickets.ticketTypeName == '经济舱'">成人票 <span
                                    class="price">---------------------------------------
                                    ￥{{ dataTicket.tickets[1].discountPrice }}元</span></div>
                            <div style="margin-left: 48px; margin-top: 15px;" v-else>
                                成人票 <span class="price">---------------------------------------
                                    ￥{{ dataTickets.ticketPrice }}元</span>
                            </div>
                        </el-row>
                        <div style="border: 0.1px solid #c8c9cc; margin-top: 20px;"></div>
                    </div>
                    <div class="total">
                        <div class="total-price"><span class="small1">￥</span>{{ price }}</div>
                    </div>
                </div>
                <!-- 往返 -->
                <div class="right" v-else-if="istransfer =='round'">
                    <div class="ticket">
                        <div style="padding-top: 5px;margin-left: 445px; font-size: 20px;">
                            <close theme="outline" size="20" fill="#333" />
                            {{data.human.length}}
                        </div>
                        <div class="row">
                            <el-row>
                                <el-col :span="24">
                                    <div class="text">
                                        {{ dataTicket.round[0].startDate }}&nbsp;
                                        {{ dataTicket.round[0].upCity }}
                                        <arrow-right theme="outline" size="22" fill="#000000" />
                                        {{ dataTicket.round[0].downCity}}
                                        <span style="font-size: 12px; padding: 3px 6px;background-color: #c6e2ff;">
                                            去程</span>
                                    </div>
                                    <div class="plane"><img :src="dataTicket.round[0].companyLogos" alt="" srcset="">
                                        {{ dataTicket.round[0].company }}
                                        {{ dataTicket.round[0].fname }}&nbsp;
                                        {{ dataTicket.round[0].pname }}&nbsp;
                                        {{ dataTickets[0].ticketTypeName }}</div>
                                </el-col>
                                <el-col :span="24">
                                    <div class="time">
                                        {{ dataTicket.round[0].startTime.slice(0, 5)}} <span class=" time-dt">--- <Time
                                                theme="outline" size="15" fill="#6b778c" />{{
                                            dataTicket.round[0].sailingTime.slice(0, 5) }}
                                            ---</span> {{ dataTicket.round[0].endTime.slice(0, 5) }}
                                    </div>
                                </el-col>
                                <el-col :span="12">
                                    <span style="font-size: 14px; margin-left: 28px;">{{
                                        dataTicket.round[0].upAirportName }}</span>
                                </el-col>
                                <el-col :span="12">
                                    <span style="font-size: 14px; margin-left: -27px;">{{
                                        dataTicket.round[0].downAirportName}}</span>
                                </el-col>
                                <div style="margin-left: 48px; margin-top: 15px;"
                                    v-if="dataTickets[0].ticketTypeName == '经济舱'">成人票 <span
                                        class=" price">---------------------------------------

                                        ￥{{ dataTicket.round[0].discountPrice }}元</span></div>
                                <div style="margin-left: 48px; margin-top: 15px;" v-else>
                                    成人票 <span class=" price">---------------------------------------
                                        ￥{{ dataTickets[0].ticketPrice }}元</span>
                                </div>
                            </el-row>
                        </div>
                        <el-row class="transit_row">
                            <el-col :span="24">
                                <div style="padding: 8px;"></div>
                                <div class="text">{{ dataTicket.round[1].startDate }}&nbsp;
                                    {{ dataTicket.round[1].upCity }}
                                    <arrow-right theme="outline" size="22" fill="#000000" />
                                    {{ dataTicket.round[1].downCity}}
                                    <span style="font-size: 12px; padding: 3px 6px;background-color: #c6e2ff;">
                                        返程</span>
                                </div>
                                <div class="plane"><img :src="dataTicket.round[1].companyLogos" alt="" srcset="">
                                    {{ dataTicket.round[1].company }}
                                    {{ dataTicket.round[1].fname }}&nbsp;
                                    {{ dataTicket.round[1].pname }}&nbsp;
                                    {{ dataTickets[1].ticketTypeName }}</div>
                            </el-col>
                            <el-col :span="24">
                                <div class="time">
                                    {{ dataTicket.round[1].startTime.slice(0, 5) }} <span class=" time-dt">---
                                        <Time theme="outline" size="14" fill="#6b778c" />{{
                                        dataTicket.round[1].sailingTime.slice(0, 5)
                                        }}
                                        ---</span> {{ dataTicket.round[1].endTime.slice(0, 5) }}
                                </div>
                            </el-col>
                            <el-col :span="12">
                                <span style="font-size: 14px; margin-left: 28px;">{{
                                    dataTicket.round[1].upAirportName }}</span>
                            </el-col>
                            <el-col :span="12">
                                <span style="font-size: 14px; margin-left: -27px;">{{
                                    dataTicket.round[1].downAirportName}}</span>
                            </el-col>
                            <div style="margin-left: 48px; margin-top: 15px;"
                                v-if="dataTickets[1].ticketTypeName == '经济舱'">成人票 <span
                                    class="price">---------------------------------------
                                    ￥{{ dataTicket.round[1].discountPrice }}元</span></div>
                            <div style="margin-left: 48px; margin-top: 15px;" v-else>
                                成人票 <span class="price">---------------------------------------
                                    ￥{{ dataTickets[1].ticketPrice }}元</span>
                            </div>
                        </el-row>
                        <div style="border: 0.1px solid #c8c9cc; margin-top: 20px;"></div>
                    </div>
                    <div class="total">
                        <div class="total-price"><span class="small1">￥</span>{{ price }}</div>
                    </div>
                </div>
                <!-- 多程 -->
                <div class="right" v-else-if="istransfer == 'multipass'">
                    <div class="ticket">
                        <div style="padding-top: 5px;margin-left: 445px; font-size: 20px;">
                            <close theme="outline" size="20" fill="#333" />
                            {{data.human.length}}
                        </div>
                        <div class="row" v-for="(item, index) in dataTicket.multipass" :key="index">
                            <el-row style="margin-top: 10px;">
                                <el-col :span="24">
                                    <div class="text">{{ item.startDate }}&nbsp;
                                        {{ item.upCity }}
                                        <arrow-right theme="outline" size="22" fill="#000000" />
                                        {{ item.downCity}}
                                        <span style="font-size: 12px; padding: 3px 6px;background-color: #c6e2ff;">
                                            第{{index+1}}程</span>
                                    </div>
                                    <div class="plane"><img :src="item.companyLogos" alt="" srcset="">
                                        {{ item.company }}
                                        {{ item.fname }}&nbsp;
                                        {{ item.pname }}&nbsp;
                                        {{ dataTickets[index].ticketTypeName }}</div>
                                </el-col>
                                <el-col :span="24">
                                    <div class="time">
                                        {{ item.startTime.slice(0, 5) }} <span class=" time-dt">--- <Time
                                                theme="outline" size="15" fill="#6b778c" />{{ item.sailingTime.slice(0,
                                            5) }}
                                            ---</span> {{ item.endTime.slice(0, 5) }}
                                    </div>
                                </el-col>
                                <el-col :span="12">
                                    <span style="font-size: 14px; margin-left: 28px;">{{
                                        item.upAirportName }}</span>
                                </el-col>
                                <el-col :span="12">
                                    <span style="font-size: 14px; margin-left: -27px;">{{
                                        item.downAirportName}}</span>
                                </el-col>
                                <div style="margin-left: 48px; margin-top: 15px;"
                                    v-if="dataTickets[index].ticketTypeName == '经济舱'">成人票 <span
                                        class=" price">---------------------------------------
                                        ￥{{ item.discountPrice }}元</span></div>
                                <div style="margin-left: 48px; margin-top: 15px;" v-else>
                                    成人票 <span class=" price">---------------------------------------
                                        ￥{{ dataTickets[index].ticketPrice }}元</span>
                                </div>
                            </el-row>
                        </div>
                        <div style="border: 0.1px solid #c8c9cc; margin-top: 20px;"></div>
                    </div>
                    <div class="total">
                        <div class="total-price"><span class="small1">￥</span>{{ price }}</div>
                    </div>
                </div>

                <!-- 直达 -->
                <div class="right" v-else>
                    <div class="ticket">
                        <div style="padding-top: 5px;margin-left: 445px; font-size: 20px;">
                            <close theme="outline" size="20" fill="#333" />
                            {{data.human.length}}
                        </div>
                        <div class="row">
                            <el-row style="margin-top: 10px;">
                                <el-col :span="24">
                                    <div class="text">{{ dataTicket.startDate }}&nbsp;
                                        {{ dataTicket.upCity }}
                                        <arrow-right theme="outline" size="22" fill="#000000" />
                                        {{dataTicket.downCity}}
                                    </div>
                                    <div class="plane"><img :src="dataTicket.companyLogos" alt="" srcset="">
                                        {{ dataTicket.company }}
                                        {{ dataTicket.fname }}&nbsp;
                                        {{ dataTicket.pname }}&nbsp;
                                        {{ dataTickets.ticketTypeName }}</div>
                                </el-col>
                                <el-col :span="24">
                                    <div class="time">
                                        {{ dataTicket.startTime && dataTicket.startTime.slice(0, 5) }} <span
                                            class=" time-dt">--- <Time theme="outline" size="15" fill="#6b778c" />
                                            {{ dataTicket.sailingTime && dataTicket.sailingTime.slice(0, 5) }}
                                            ---</span> {{ dataTicket.endTime && dataTicket.endTime.slice(0, 5) }}
                                    </div>
                                </el-col>
                                <el-col :span="12">
                                    <span style="font-size: 14px; margin-left: 28px;">{{
                                        dataTicket.upAirportName }}</span>
                                </el-col>
                                <el-col :span="12">
                                    <span style="font-size: 14px; margin-left: -27px;">{{
                                        dataTicket.downAirportName}}</span>
                                </el-col>
                                <div style="margin-left: 48px; margin-top: 15px;"
                                    v-if="dataTickets.ticketTypeName == '经济舱'">成人票 <span
                                        class=" price">---------------------------------------
                                        ￥{{ dataTicket.discountPrice }}元</span></div>
                                <div style="margin-left: 48px; margin-top: 15px;" v-else>
                                    成人票 <span class=" price">---------------------------------------
                                        ￥{{ dataTickets.ticketPrice }}元</span>
                                </div>
                            </el-row>
                        </div>
                        <div style="border: 0.1px solid #c8c9cc; margin-top: 20px;"></div>
                    </div>
                    <div class="total">
                        <div class="total-price"><span class="small1">￥</span>{{ price }}</div>
                    </div>
                </div>
                <div class="sum">
                    <div class="zu">
                        <el-checkbox size="large" v-model='yh' @change="tlMy"></el-checkbox>
                        <span class="le">是否使用优惠?</span><span style="margin-left: 10px;">当前积分：{{ jf }}</span>
                        <p>使用积分:
                            <el-input-number v-model="num" :min="0" :step="10" :max="jf" @change="tlMy" />
                            <span class="small">注:10积分可抵一元</span>
                        </p>

                        <div style="padding-left:70px">
                            <span class="small" v-if="yh">本次扣减积分:{{ c }},剩余积分:{{ jf - c }}</span>
                        </div>
                    </div>
                </div>
                <el-button type="primary" plain size="large" @click="next" class="down-step">下一步</el-button>
            </div>
        </div>
        <!-- 添加人员 -->
        <el-drawer v-model="AddPeople" title="新增常用乘机人" :with-header="true" :append-to-body="true"
            :modal-append-to-body="false">
            <el-row>
                <el-col>
                    <div class="UserMsg">
                        人员姓名：
                        <el-input placeholder="请填写你的姓名" v-model.trim="People.peopleName" clearable class="BoxInput" />
                    </div>
                </el-col>
                <el-col>
                    <div class="UserMsg">
                        身份证号：
                        <el-input placeholder="请填写你的身份证号码" v-model.trim="People.carId" clearable maxlength="18"
                            show-word-limit style="font-size: 16px;" class="BoxInput" />
                    </div>
                </el-col>
                <el-col>
                    <div class="UserMsg">
                        电话号码：
                        <el-input placeholder="请填写你的手机号码" v-model.trim="People.phone" clearable maxlength="11"
                            show-word-limit class="BoxInput" />
                    </div>
                </el-col>
                <el-col>
                    <div class="UserMsg">
                        <el-button type="primary" plain class="add_btn" @click="addPeople" :loading="load">确认添加
                        </el-button>
                    </div>
                </el-col>
            </el-row>
        </el-drawer>
    </div>
</template>

<script setup>
import { Time, Close, ArrowRight } from "@icon-park/vue-next"
import { ref, defineEmits, reactive, getCurrentInstance } from 'vue'
import { useRouter, useRoute } from "vue-router";
import { ElMessage } from 'element-plus'
import url from "../../common/js/APIUtil";
const router = useRouter();
const { proxy } = getCurrentInstance();
const route = useRoute();
const dataTicket = JSON.parse(localStorage.getItem('ticket'))
const dataTickets = JSON.parse(localStorage.getItem('tickets'))
const emits = defineEmits(['update'])
const active = ref(0)
let price = ref();
const add = ref(false);
const yh = ref(false);
const jf = ref(JSON.parse(sessionStorage.getItem('username')).fraction);
const c = ref(0);
const num = ref(0);
var test = ref(false);
let load = ref(false)
// 添加人员
let People = reactive({
    peopleName: "",
    carId: "",
    radio1: "男",
    phone: ""
})
// 弹窗隐藏
let showUser_info = ref(false)
let AddPeople = ref(false)
let hideUpUser = () => {
    // 隐藏修改用户文本框
    showUser_info.value = false
    // 隐藏添加人员文本框
    AddPeople.value = false
    load.value = false
}
// 显示
let istransfer = ref('')
// 显示添加人员文本框
let showAddPeople = () => {
    AddPeople.value = true
}
const data = reactive({
    people: [],
    human: []
})


const status = () => {
    emits('update', 0);
}
status();

const te = (value, index) => {
    if (!test.value) {
        if (data.human.length <= 1) {
            data.human[0] = value;
            test.value = true;
            data.people.splice(index, 1);
        }
    } else {
        data.human.push(value);
        data.people.splice(index, 1);
    }
    totalMoney()
}

const totalMoney = () => {
    // 中转
    if (dataTicket.tickets) {
        istransfer.value = 'tickets'
        if (dataTickets.ticketTypeName == "经济舱") {
            price.value = (dataTicket.tickets[0].discountPrice + dataTicket.tickets[1].discountPrice) * data.human.length
        } else {
            price.value = (dataTickets.ticketPrice * 2) * data.human.length
        }
    }
    // 往返
    else if (dataTicket.round) {
        istransfer.value = 'round'
        if (dataTickets[0].ticketTypeName == "经济舱" && dataTickets[1].ticketTypeName == "经济舱") {
            price.value = (dataTicket.round[0].discountPrice + dataTicket.round[1].discountPrice) * data.human.length
        } else {
            price.value = (dataTickets[0].ticketPrice + dataTickets[1].ticketPrice) * data.human.length
        }
    }
    // 多程
    else if (dataTicket.multipass) {
        istransfer.value = 'multipass'
        price.value = JSON.parse(localStorage.getItem('totalPrice')) * data.human.length
    }
    else {
        if (dataTickets.ticketTypeName == "经济舱") {
            price.value = dataTicket.discountPrice * data.human.length
        } else {
            price.value = dataTickets.ticketPrice * data.human.length
        }
    }

}
let msg=reactive({
    order:{
        userId:sessionStorage.getItem("id"),
        orderMoney:"",
        ticketPrice:"",
        ticketType:""
    },
    peopleId:[],
    ticketId:[],
    ticketStoreId:[]
})
let o=sessionStorage.getItem("orderId")
let byOrder=sessionStorage.getItem("Byorder")
let item=JSON.parse(sessionStorage.getItem("item"))
let money=sessionStorage.getItem("money")
const next = () => {
    msg.order.orderMoney=price.value
    emits('update', active.value + 1);
    if (data.human[0] == "") {
        ElMessage.error('乘机人不能为空！！！')
    } else {
        if(dataTickets.length>1)
        {
            for(var i=0;i<dataTickets.length;i++){
                msg.ticketId.push(dataTickets[i].ticketId)
                msg.ticketStoreId.push(dataTickets[i].id)
            }
        }
        else{
            msg.ticketId.push(dataTickets.ticketId)
            msg.ticketStoreId.push(dataTickets.id)
        }

        for(var j=0;j<data.human.length;j++)
        {
            msg.peopleId.push(data.human[j].id)
        }
        msg.order.ticketPrice= msg.order.orderMoney/msg.peopleId.length
        if(dataTickets.length%1==0)
        {
         msg.order.ticketType=dataTickets[0].ticketType
        }
        else{
         msg.order.ticketType=dataTickets.ticketType
            
        }
        if(byOrder==1)
        {
            let uId=JSON.parse(sessionStorage.getItem("username"))
            let ticketidarr=[]
            for(var i=0;i<item.ticketVo.length;i++){
                // ticketidarr.push(ticketId[i].ticketId)
                ticketidarr.push(item.ticketVo[i].storeId);
            }
            proxy.$http({
                method:"post",
                url:url.API_GET_RETREATTICKET,
                data:ticketidarr
            })
            proxy.$http({
                method:"get",
                url:url.API_GET_ADDMONEY+uId.id+"/"+money
            })
            proxy.$http({
                method:"get",
                url:url.API_Update_OrderStatus_ById+o+"/"+"5"
            }).then((res)=>{
                if(res){
                        ElMessage.success("钱已退还...")

                }
            })
            proxy.$http({
                method:"post",
                url:url.API_POST_CREATEORDER,
                data:msg
            }).then(res=>{
                if(res){
                    console.log(res);
                    localStorage.setItem('order_id',res.data)
                    router.push({
                        path: "/index/passenger/pay",
                    });
                }
            })




        }
        else
        {
            proxy.$http({
                method:"post",
                url:url.API_POST_CREATEORDER,
                data:msg
            }).then(res=>{
                if(res){
                    console.log(res);
                    localStorage.setItem('order_id',res.data)
                    ElMessage.success("创建订单成功！！")
                    router.push({
                        path: "/index/passenger/pay",
                    });
                }
            })
        }

        localStorage.setItem('people', JSON.stringify(data.human))
        localStorage.setItem('seconds', 1800);
        localStorage.setItem("price", JSON.stringify(price.value))
    }
    msg.peopleId = []
    msg.ticketId = []
    msg.ticketStoreId = []
}

const re = (value, index) => {
    if (value != '') {
        if (data.human.length > 1) {
            data.people.push(value);
            data.human.splice(index, 1);
            ElMessage.success('删除成功');
        } else {
            data.people.push(value);
            test.value = false;
            data.human[0] = '';
        }
    }
    totalMoney();
}

const tlMy = () => {
    if (yh.value) {
        totalMoney();
        if (jf.value > 0) {
            for (var i = 0; i <= num.value; i++) {
                if (price.value - i / 10 == 0) {
                    num.value = i;
                    c.value = num.value;
                    price.value = (price.value - (num.value / 10)).toFixed(0)
                    return;
                } else if (i == num.value) {
                    num.value = i;
                    c.value = num.value;
                    price.value = (price.value - (num.value / 10)).toFixed(0)
                }
            }
        }
    } else {
        totalMoney();
    }
}

const getPeople = () => {
    proxy.$http.get(url.API_PEOPLE + "/" + sessionStorage.getItem('id')).then(res => {
        data.people = res.data;
        te(data.people[0], 0);
    })
}
// 添加人员
let addPeople = () => {
    load.value = true
    if (People.peopleName == "" || People.carId == "" || People.radio1 == "" || People.phone == "" || People.carId.length < 18 || People.phone.length < 11) {
        ElMessage.warning("请确认您的信息是否填写正确！")
        load.value = false
        return
    }
    else {
        proxy.$http({
            method: "post",
            data: {
                nickname: People.peopleName,
                cardId: People.carId,
                sex: People.radio1,
                phone: People.phone
            },
            url: url.API_PEOPLE + sessionStorage.getItem("id")
        }).then((res) => {
            load.value = true
            if (res.data.code == 200) {
                ElMessage.success("添加成功...")
                location.reload()
                load.value = false
                return
            }
            if (res.data.code == 443) {
                ElMessage.warning("请检查你的身份证格式是否正确...")
                load.value = false
                return
            }
            else {
                ElMessage.warning("添加失败...")
                load.value = false
                return
            }
        })
    }
}
getPeople();

let pgup = function () {
    proxy.$router.back()
}

</script>

<style land="less" scoped>
.col_info{
    width: 100%;
    height: 40px;
    border-radius: 5px;
    background-color: white;
    box-shadow: 1px 1px 5px 1px rgba(0, 0, 0, 0.1);
}
.col_info_div{
    margin-left: 20px;
    margin-top: 8px;
}
.label{
    margin-top: 10px;
}
.content {
    width: 100%;
    height: 750px;
}
.left {
    float: left;
    width: 65%;
    height: 100%;
    /* background-color:blue; */
}
.right_div{
    float: left;
    width: 32%;
}
.right {
    margin-top: 46px;
    margin-left: 30px;
    width: 100%;
    min-height: 330px;
    border-radius: 10px;
    box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.2);
    background-color: #F5F7FA;
}
.transit_row{
    text-align: center;
}
.transit_shipment{
    padding: 5px 8px;
    font-size: 14px;
    border-radius: 2px;
    background-color: #c8c9cc;
}
.down-step {
    margin: 20px;
    margin-top: 10px;
    margin-left: 30px;
    height:45px;
    width: 490px;
}
.sum {
    margin-top: 10px;
    margin-left: 30px;
    width: 490px;
    height: 120px;
    border-radius: 10px;
    box-shadow: 2px 1px 2px 2px rgba(0, 0, 0, 0.2);
}
.pgup {
    position: absolute;
    top: 70px;
    right: 35px;
    color: #849bab;
    cursor: pointer;
}

.pgup:hover {
    color: #409EFF;
}
.userCard {
    margin-top: 15px;
    padding-bottom: 30px;
    width: 100%;
    min-height: 400px;
    box-shadow: 3px 3px 10px 3px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    background-color: #ecf5ff;
}
.title {
    padding: 20px;
    padding-left: 35px;
    font-size: 28px;
    font-weight: 500;
}
.o-card {
    margin-bottom: 30px;
    margin-left: 35px;
    width: 900px;
    min-height: 220px;
    border-radius: 5px;
    box-shadow: var(--el-box-shadow-light);
    border: 1px solid rgba(0, 0, 0, 0.2);
    background: rgba(255,255,255, 0.6);
}
.card-left {
    float: left;
    width: 20%;
    height: 220px;
    border-right: 1px solid rgba(0, 0, 0, 0.2);
}
.span {
    text-align: center;
    line-height: 220px;
    font-size: 80px;
    font-weight: 600;
    color: #665f5f;
}
.card-right {
    padding-top: 10px;
    padding-left: 270px;
    width: 600px;
}
.info_row{
    margin: 10px;
    padding: 5px;
    border-radius: 7px;
    background:rgba(247,251,255,0.6);
    box-shadow: var(--el-box-shadow-light);
}
.info {
    margin-top: 20px
}
.row {
    padding-bottom: 20px;
    text-align: center;
}
.text {
    font-size: 24px
}
.plane {
    font-size: 15px;
    margin-top: 10px;
    color: #6b778c;
}
.border_people{
    margin: 0;
    /* box-shadow: var(--el-box-shadow); */
}
.plane img {
    width: 15px;
    height: 15px;
}
.time {
    margin-top: 10px;
    font-size: 22px;
}
.time .time-dt {
    margin: 0 20px;
    font-size: 16px;
    color: #6b778c;
}
.price {
    color: #6b778c;
}
.total {
    height: 70px;
    margin-top: 13px;
}
.total-price {
    margin-right: 50px;
    float: right;
    font-size: 40px;
    color: red;
    font-weight: 600;
}
.total-price .small1 {
    font-size: 20px;
}
.button {
    text-align: center;
}
.button .bu {
    border-radius: 30px;
    width: 180px;
    height: 50px;
}
.del {
    position: absolute;
    height: 40px;
    width: 40px;
    left: 896px;
    margin-top: -11px;
    border: none;
    color: rgba(28, 26, 155, 0.8);
    background-color: rgba(0, 0, 0, 0.0);
    cursor: pointer;
}


.people {
    margin-top: 20px;
    width: 100%;
}
.people-title {
    font-size: 20px;
}

.zu {
    padding: 18px;
    padding-left: 76px;
    font-size: 20px;
    color: #6b778c;
}
.le {
    margin-left: 20px;
    margin-right: 30px;
}
.margin-top .bu {
    margin-left: 20px;
    margin-right: -90px;
    
}

.small {
    font-size: 10px;
    color: red;
    border-radius: 5px;
    margin-left: 20px;
}


.BoxInput {
  width: 79%;
  height: 40px;
  font-size: 18px;
}

.UserMsg {
  margin-top: 20px;
  margin-left: 23px;
}
.add_btn{
    width: 79%;
    height: 40px;
    margin-left: 87px;
}
el-radio {
  font-size: 18px;
}
</style>